

Ext.require(['*']);

//we want to setup a model and store instead of using dataUrl
Ext.define('itemFaseModel', {
	extend: 'Ext.data.Model',
	fields: [
		{name: 'nombreItem',     type: 'string'},
		{name: 'nombreFase',     type: 'string'}
		
	]
});

Ext.define('modelUsuarios', {
	extend: 'Ext.data.Model',
	proxy : {
		type : 'ajax',
		//actionMethods : 'POST',
		url : '/usuarios/view', //application/controllers/Habitacion.php
		
		api: {
                read: '/usuarios/view'
		},
	
		reader: {
				
                type: 'json',
                idProperty: 'id',
                root: 'usuarios',
                totalProperty: 'totalUsuarios'
        }
	},
	fields: [
		{type: 'int' , name: 'id'},
		{type: 'string', name: 'username'},
		{type: 'string', name: 'nombre'},
		{type: 'string', name: 'apellido'},
		{type: 'string', name: 'correo'},
		{type: 'string', name: 'password'},
		{type: 'string', name: 'estado'}
	]
});

Ext.define('miembroModel', {
	extend: 'Ext.data.Model',
	fields: [
		{type: 'string' , name: 'id'},
		{type: 'string', name: 'username'},
		{type: 'string', name: 'nombre'},
		{type: 'string', name: 'apellido'},
		{type: 'string', name: 'correo'},
		{type: 'string', name: 'password'},
		{type: 'string', name: 'estado'}
	]
});

Ext.define('modelRoles2', {
	extend: 'Ext.data.Model',
	
	fields: [
		{type: 'string' , name: 'idRol'},
		{type: 'string', name: 'nombreRol'},
		{type: 'string', name: 'descripRol'}
			]
});

Ext.define('modelFases2', {
	extend: 'Ext.data.Model',
	fields: [
		{type: 'int' , name: 'idFase'},
		{type: 'string', name: 'nombreFase'},
		{type: 'string', name: 'descripFase'},
		{type: 'string', name: 'inicioFase'},
		{type: 'string', name: 'finFase'},
		{type: 'string', name: 'observFase'},
		{type: 'string', name: 'estadoFase'},
		{type: 'string', name: 'ordenFase'}
		]
});

Ext.define('GestionMiembroLiveSearchGridPanel', {
    extend: 'Ext.ux.LiveSearchGridPanel',
    
    initComponent: function() {
        
        //Ext.Msg.alert('Estoy en el initComponet del live!!!');
        var me = this;
        me.tbar = ['Buscar',{
                 xtype: 'textfield',
                 name: 'searchField',
                 hideLabel: true,
                 width: 200,
                 listeners: {
                     change: {
                         fn: me.onTextFieldChange,
                         scope: this,
                         buffer: 100
                     }
                 }
            }, {
                xtype: 'button',
                text: '<',
                tooltip: 'Anterior',
                handler: me.onPreviousClick,
                scope: me
            },{
                xtype: 'button',
                text: '>',
                tooltip: 'Siguiente',
                handler: me.onNextClick,
                scope: me
            }, '-', {
                xtype: 'checkbox',
                hideLabel: true,
                margin: '0 0 0 4px',
                handler: me.regExpToggle,
                scope: me                
            }, 'Expresión Regular', {
                xtype: 'checkbox',
                hideLabel: true,
                margin: '0 0 0 4px',
                handler: me.caseSensitiveToggle,
                scope: me
            }, 'Detectar Mayúsculas'];
        
        me.callParent(arguments);
    }
});


 Ext.define('Ext.form.ClosableFieldSet', {
	extend: 'Ext.form.FieldSet',
	alias: 'widget.closablefieldset'  
});

Ext.define('App.view.GestionMiembro', {
	extend: 'Ext.panel.Panel',
    alias: 'widget.tabfirst',
    //title: 'Administación de Proyectos',
	layout:'anchor',
	
	initComponent: function () {
	
	    //para que funcionen los toolTips
	    Ext.QuickTips.init();
	    console.log('entre en el initComponent');
	    this.storeMiembro = Ext.create('Ext.data.Store', {
		    storeId: 'rolesMiembroStore',
			model: 'miembroModel',
		    proxy: {
			    type: 'ajax',
				url: '/usuarios/verMiembrosAsignados',
			    reader: {
				    type: 'json',
					root: 'usuarios'
			    }
		    } 
	    });

	    
	    this.myIdProyecto = idProyectoAux;
	    
        this.myNombreProyectoAux = nombreProyectoAux;
        
	    console.log('this.myIdProyecto = idProyectoAux;-->');
	    console.log(this.myIdProyecto);
	    
	    
	    //cargamos el store para que nos traiga todos los miembros asignados al proyecto
	    this.storeMiembro.load(
			    {
				    params:{idProyecto: this.myIdProyecto}
			    }
	    );
	    
	    
	    
	    this.grouping = Ext.create('Ext.grid.feature.Grouping', {
			    groupHeaderTpl: 'Usuario: {name}',
			    enableGroupingMenu: false
		}); 
	
		    /*this.idBtonCrearItem = 'btn_grid_crear_item' + this.myIdProyecto;
		    console.log(this.idBtonCrearItem);*/
		    
		this.idBtonListarMiembro = 'btn_grid_listar_miembro' + this.myIdProyecto;
		this.idBtonAgregarMiembro = 'btn_grid_agregar_miembro' + this.myIdProyecto;
		this.idBtonEditarMiembro = 'btn_grid_editar_miembro' + this.myIdProyecto;
		this.idBtonEliminarMiembro = 'btn_grid_eliminar_miembro' + this.myIdProyecto;
		//console.log(this.idBtonCrearItem);
		    
		//toolBar
		this.Tblgrid = Ext.create('Ext.toolbar.Toolbar',{
			items : [
				{
					xtype : 'button',
					id : this.idBtonAgregarMiembro,//'btn_grid_editar_rol',
					itemId : this.idBtonAgregarMiembro,//'btn_grid_editar_rol',
					text : 'Agregar Miembro',
					iconCls : 'icon_button_add',
					tooltip : 'Asignar un nuevo miembro al Proyecto',
					scope : this,
					handler : this.AgregarMiembroRecordSelect
				},{
					xtype : 'tbseparator'
				},{
					xtype : 'button',
					id : this.idBtonEliminarMiembro,
					itemId : this.idBtonEliminarMiembro,
					text : 'Eliminar Miembro',
					iconCls : 'icon_btn_grid_eliminar_rol',
					disabled : true,
					tooltip : 'Eliminar el registro seleccionado',
					scope : this,
					handler : this.DeleteRecordSelect
				},{
					xtype : 'tbseparator'
				},{
					xtype : 'button',
					id : this.idBtonListarMiembro,//'btn_grid_editar_rol',
					itemId : this.idBtonListarMiembro,//'btn_grid_editar_rol',
					text : 'Gestionar Roles',
					iconCls : 'icon_btn_grid_editar_rol',
					disabled : true,
					tooltip : 'Administración de roles en el Miembro seleccionado',
					scope : this,
					handler : this.GestionRolesRecordSelect
				}
			]
		});



		this.grid = Ext.create(/*'Ext.grid.Panel'*/ 'GestionMiembroLiveSearchGridPanel', {
			
			frame : true,
			store : this.storeMiembro,
			stripeRows : true,
			columnLines: true,
			loadMask : true,
			//width : 550,
			//height : 400,
			anchor: '60% 90%', 
			//features: [this.grouping],
			dockedItems : [this.Tblgrid,
				Ext.create('Ext.ux.StatusBar', {
				defaultText: this.defaultStatusText,
				name: 'searchStatusBar'
				})
			],
			columns: 
			[
				{
					text: 'Miembro',
					dataIndex: 'username',
					flex: 1
				},
				{
					text: 'Nombre',
					dataIndex: 'nombre',
					flex: 1
				},
				{
					text: 'Apellido',
					dataIndex: 'apellido',
					flex: 1
				}
				,
				{
					text: 'Estado',
					dataIndex: 'estado',
						flex: 1
				}
			],
			bbar: Ext.create('Ext.PagingToolbar', {
				store : this.storeMiembro,
				displayInfo : true,
				displayMsg : 'Mostrando registros {0} - {1} de {2}',
				emptyMsg : "Sin registros para mostrar"
			}),
			listeners:{
				scope:this,     
				
				'selectionchange': function(view, records) {
					Ext.getCmp(this.idBtonEliminarMiembro).setDisabled(false);
					Ext.getCmp(this.idBtonListarMiembro).setDisabled(false);
				}
				   
			}
			
		});
	
	
		
		this.items = [this.grid];
		this.callParent(arguments);
			
	
		this.grid.getStore().addListener('load', function(store, records, successful, operation, options){
			if(successful){
				if(records.length > 0){
					var first = this.getStore().first();
					var title = 'Gestionar Miembro del Proyecto: '+ nombreProyectoAux; //'Año: ' + first.get('anho') + ', Periodo: ' + first.get('periodoAnual') ;
					this.setTitle(title);
				}
			}
		}, this.grid);
	},
	
	GestionRolesRecordSelect: function(){
		/* cuando abro 2 tab de gestion roles, el id global de proyecto se queda con el ultimo valor 
		 * que se abrió de idProyectoAux; entonces, si en proyecto (Proyecto SCP) esta un usuario con rol (administrador)
		 * y en otro proyecto (Proyecto 3), el mismo usuario tiene otro rol (desarrollador), me lista los roles del ultimo
		 * proyecto q abrimos q tiene ese usuario en ese proyecto
		 * 
		 * es sintesis: el this.myIdProyecto no se queda con su propio ID q le corresponde, si no con el ultimo
		 * tab que se abrio de gestion miembro.
		 * 
		 * QUIRO SOLUCION!!!!*/
		
		miembroSeleccionado = this.grid.getSelectionModel().getSelection()[0].data;
        //this.myIdProyecto = idProyectoAux;
        //this.myNombreProyecto = nombreProyectoAux;
        console.log('la variable global idProyectoAux es');
		console.log(idProyectoAux);
		console.log('la var LOCAL this.myIdProyecto es');
		console.log(this.myIdProyecto);
		this.storeRoles = Ext.create('Ext.data.Store', {
			storeId: 'miembroRolStore',
			model: 'modelRoles2',
			proxy: {
				type: 'ajax',
				url: '/roles/traerRolesDeMiembro',
				reader: {
					type: 'json',
					root: 'roles'
				}
			},
			idMiembro: miembroSeleccionado.id,
			idProyecto: this.myIdProyecto,
			//codItem:itemSeleccionado.codItem,
			autoLoad: {start: 0, limit: 25, params:{id: miembroSeleccionado.id, idProyecto: this.myIdProyecto}} 
			
		});
		
		//toolBar
		this.TblgridAsignacion = Ext.create('Ext.toolbar.Toolbar',{
			items : [
				{
					xtype : 'button',
					id : 'id_rol_agregar_btn',
					itemId : 'id_rol_agregar_btn',
					text : 'Agregar Rol',
					iconCls : 'icon_button_add',
					tooltip : 'Asignar un Rol al Miembro',
					scope : this,
					//disabled: true,
					handler : this.AgregarRolMiembro
				},{
					xtype : 'tbseparator'
				},{
					xtype : 'button',
					id : 'id_rol_editar_btn',
					itemId : 'id_rol_editar_btn',
					text : 'Editar Rol',
					//iconCls : 'icon_btn_grid_editar_rol',
					disabled : true,
					tooltip : 'Editar el Rol Seleccioando...',
					scope : this,
					handler : this.EditarRolRecordSelect
				},{
					xtype : 'tbseparator'
				},{
					xtype : 'button',
					id : 'id_rol_eliminar_btn',
					itemId : 'id_rol_eliminar_btn',
					text : 'ELiminar Rol',
					//iconCls : 'icon_btn_grid_editar_rol',
					disabled : true,
					tooltip : 'Eliminar el Rol Seleccioando...',
					scope : this,
					handler : this.EliminarRolRecordSelect
				}
			]
		});
		
		//grilla donde se van a mostrar las versiones del Item
		this.gridRoles = Ext.create(/*'Ext.grid.Panel'*/ 'DesarrolloItemLiveSearchGridPanel', {
			
			title: 'Roles Asignados a: "'+ miembroSeleccionado.username +'" en el Proyecto: "'+ this.myNombreProyectoAux + '"',
			frame : true,
			store : this.storeRoles,
			stripeRows : true,
			columnLines: true,
			loadMask : true,
			//width : 550,
			//height : 400,
			anchor: '100% 90%', 
			//features: [this.grouping],
			dockedItems : [this.TblgridAsignacion,
				Ext.create('Ext.ux.StatusBar', {
				defaultText: this.defaultStatusText,
				name: 'searchStatusBar'
				})
			],
			columns: 
			[
				{
					//text: 'id',
					hidden: true,
					dataIndex: 'idRol',
					flex: 1
				},
				{
					text: 'Rol',
					dataIndex: 'nombreRol',
					flex: 1
				},
				{
					text: 'Descripción',
					dataIndex: 'descripRol',
					flex: 1
				}
			],
			bbar: Ext.create('Ext.PagingToolbar', {
				store : this.storeRoles,
				displayInfo : true,
				displayMsg : 'Mostrando registros {0} - {1} de {2}',
				emptyMsg : "Sin registros para mostrar",
				
				doRefresh : function(){
					var store = this.store;
					store.loadPage(store.currentPage, 
						{
							params: 
							{
								id: store.idMiembro,
								idProyecto: store.idProyecto
								//codItem:store.codItem
							}
						}
					
					
					);
				},
				
			}),
			
			listeners:{
				scope:this,     
				
				'selectionchange': function(view, records) {
					Ext.getCmp('id_rol_editar_btn').setDisabled(false);
					Ext.getCmp('id_rol_eliminar_btn').setDisabled(false);
				} 
			}
			
		});
		
		//Creamos la ventana que contendra el FormaPanel creado anteriormente
		this.WindowFormListaRolesAsignadosModal = Ext.create('Ext.window.Window',{
			title : 'Roles Asignados al Miembro',
			bodyStyle : 'padding:10px 10px 10px 10px',
			region : 'center',
			width : 700,
			//height : 400,
			//autoWidth:true,
			autoHeight:true,
			modal : true,
			resizable : false,
			draggable : false,
			closable : true,
			closeAction : 'destroy',
			buttons: 
			[
				{
					text : 'Cancelar',
					id : 'id_btn_cancelar_rol',
					//iconCls : 'icon_button_cancel',
					scope : this,
					handler : function(){
						this.WindowFormListaRolesAsignadosModal.close();
					}
				}	
			],
			items : [this.gridRoles]
		});
		//Mostramos la ventana con el formulario de edicion y los datos del registro seleccionado
		this.WindowFormListaRolesAsignadosModal.show();
		
		
	},
	
	AgregarRolMiembro: function(){
		
		miembroSeleccionado = this.grid.getSelectionModel().getSelection()[0].data;
		
		this.storeRoles2 = Ext.create('Ext.data.Store', {
		    storeId: 'rolesMiembroStore',
			model: 'modelRoles2',
		    proxy: {
			    type: 'ajax',
				url: '/roles/viewRoles',
			    reader: {
				    type: 'json',
					root: 'roles'
			    }
		    },
		    idMiembro: miembroSeleccionado.id,
			idProyecto: this.myIdProyecto,
			//codItem:itemSeleccionado.codItem,
			autoLoad: {start: 0, limit: 25, params:{id: miembroSeleccionado.id, idProyecto: this.myIdProyecto}} 
			 
	    });
	    
	    //ComboBox para mostrar todos los roles disponibles
		this.cmbRoles = Ext.create('Ext.ux.form.field.BoxSelect', {

			fieldLabel: 'Roles Disponibles',
			name : 'cmb_roles_asignar',
			id: 'id_cmbx_roles_asignar',
			displayField: 'nombreRol',
			width: 494,
			//height: 50,
			//labelWidth: 130,
			store: this.storeRoles2,
			queryMode: 'local',
			emptyText: 'Seleccione el Rol para el Miembro',
			valueField: 'idRol',
			multiSelect :false,
			allowBlank : false
			
		});
		
		this.storeFases = Ext.create('Ext.data.Store', {
		    storeId: 'rolesFaseStore',
			model: 'modelFases2',
		    proxy: {
			    type: 'ajax',
				url: '/fases/traerFases',
			    reader: {
				    type: 'json',
					root: 'fases'
			    }
		    },
			idProyecto: this.myIdProyecto,
			//codItem:itemSeleccionado.codItem,
			autoLoad: {start: 0, limit: 25, params:{idProyecto: this.myIdProyecto}} 
			 
	    });
		
		//ComboBox para mostrar todas las fases disponibles del proyecto
		this.cmbFases = Ext.create('Ext.ux.form.field.BoxSelect', {

			fieldLabel: 'Fases Disponibles',
			name : 'cmb_fase_asignar',
			id: 'id_cmbx_fase_asignar',
			displayField: 'nombreFase',
			width: 494,
			//height: 50,
			//labelWidth: 130,
			store: this.storeFases,
			queryMode: 'local',
			emptyText: 'Seleccione la Fase al cual tendra el Rol',
			valueField: 'idFase',
			multiSelect :true,
			allowBlank : false
			
		});
		
		//Creamos el FormPanel que contendra los datos a agregar
		this.FormRolAddFasesModal = Ext.create('Ext.form.Panel',{
			frame :true,
			title : 'Asignacion de Roles',
			bodyStyle :'padding:5px 5px 5px 5px',
			width : 540,
			//height : 100,
			autoHeight : true,
			defaultType: 'textfield',
			items: [
				{
					xtype : 'fieldcontainer',
					labelStyle : 'font-weight:bold;padding:0',
					anchor : '90%',
					items: [
						this.cmbRoles,
					]
				},
				{
					xtype : 'fieldcontainer',
					labelStyle : 'font-weight:bold;padding:0',
					anchor : '90%',
					items: [
						this.cmbFases,
					]
				}
			],
			buttons: [
				{
					text : 'Guardar',
					id : 'id_btn_guardar_rol_fases',
					iconCls : 'icon_button_save',
					scope : this,
					handler : this.HandlerRolAddFases
				},{
					text : 'Cancelar',
					id : 'id_btn_cancelar_asignacion',
					iconCls : 'icon_button_cancel',
					scope : this,
					handler : function(){
						this.WindowFormRolAddFasesModal.close();
					}
				}
			]
		});
		//Una vez creado el FormPanel lo reseteamos
		this.FormRolAddFasesModal.getForm().reset();
		
		//Creamos la ventana que contendra el FormaPanel creado anteriormente
		this.WindowFormRolAddFasesModal = Ext.create('Ext.window.Window',{
			title : 'Administrar Roles',
			bodyStyle : 'padding:10px 10px 10px 10px',
			region : 'center',
			autoWidth: true,
			//width : 700,
			//height : 155,
			autoHeight : true,
			modal : true,
			//resizable : false,
			draggable : false,
			closable : true,
			closeAction : 'destroy',
			items : [this.FormRolAddFasesModal]
		});
		//Mostramos la ventana con el formulario de edicion y los datos del registro seleccionado
		this.WindowFormRolAddFasesModal.show();
	
	
	},
	
	HandlerRolAddFases: function(){
		//this.myIdProyecto = idProyectoAux;
		miembroSeleccionado = this.grid.getSelectionModel().getSelection()[0].data;
		
		if (this.FormRolAddFasesModal.getForm().isValid()){
			
			this.FormRolAddFasesModal.getForm().submit({
				method : 'POST',
				//type: "json",
				url : '/roles/guardarAsignacion', 
				clientValidation : true,
				scope : this,
				params : {
					idProyecto: this.myIdProyecto,
					idMiembro: miembroSeleccionado.id,
					idRol: Ext.JSON.encode(Ext.getCmp('id_cmbx_roles_asignar').getValue()),
					idsFases : Ext.JSON.encode(Ext.getCmp('id_cmbx_fase_asignar').getValue())
				},
				success: function(form, action){
					this.WindowFormRolAddFasesModal.close();
					this.storeRoles.load(
						{
							params:{id: miembroSeleccionado.id, idProyecto: this.myIdProyecto}
						}
					);
				},
				failure: function(form, action){
					Ext.Msg.alert("Error",action.result);
					Ext.MessageBox.show({
						title : 'Informacion del sistema',
						msg : action.result.msg,
						buttons : Ext.MessageBox.OK,
						icon : Ext.MessageBox.ERROR,
						width : 350
					});
				} //End failure
			});
			
		}
		
	
	},
	
	EliminarRolRecordSelect: function(){
		Ext.MessageBox.show({
			title : "Información del sistema",
			msg : "¿Realmente desea eliminar el registro seleccionado?",
			buttons : Ext.MessageBox.YESNO,
			icon : Ext.MessageBox.INFO,
			scope : this,
			fn : this.EliminarRolSeleccionadoDelMiembro,
			width : 400
		});
		
	},
	
	//método que realiza la eliminación si es que se acepta el popUp
	EliminarRolSeleccionadoDelMiembro : function(btn){
		if (btn == 'yes') { //btn=='yes'
			//this.WindowAdmAtributos.el.mask('Eliminando datos....Espere por favor...');
			miembroSeleccionado = this.grid.getSelectionModel().getSelection()[0].data;
			rolSeleccionado = this.gridRoles.getSelectionModel().getSelection()[0].data;
			Ext.Ajax.request({
				url : '/roles/eliminarRolDeMiembro', //application/controllers/Habitacion.php
				method : 'POST',
				scope : this,
				params : {
					idRol	  : rolSeleccionado.idRol,
					id : miembroSeleccionado.id,
					idProyecto: this.myIdProyecto
				},
				success: function(response, opts) { //success
					var obj = Ext.JSON.decode(response.responseText);
					if(obj.success==true){
						this.storeRoles.load(
							{
								params:{id: miembroSeleccionado.id, idProyecto: this.myIdProyecto}
							}
					);
						Ext.Msg.alert('Estatus',  obj.msg);
						//this.WindowAdmAtributos.el.unmask();
					}
					else if(obj.success==false){
						//this.WindowAdmAtributos.el.unmask();
							Ext.MessageBox.show({
								title : "Informacion del sistema",
								msg : obj.msg,
								buttons : Ext.MessageBox.OK,
								icon : Ext.MessageBox.ERROR,
								width : 400
							});
					}
					else{
						//this.WindowAdmAtributos.el.unmask();
						Ext.MessageBox.show({
							title : "Informacion del sistema",
							msg : "Mensaje de error alternativo a la eliminacion del registro seleccionado",
							buttons : Ext.MessageBox.OK,
							icon : Ext.MessageBox.ERROR,
							width : 400
						});
					}
				}, //success
				failure: function(response, opts) { //failure
					//this.WindowAdmAtributos.el.unmask();
					var obj = Ext.JSON.decode(response.responseText);
					Ext.MessageBox.show({
						title : "Informacion del sitema",
						msg : "Error de conexion al servidor de la base de datos",
						buttons : Ext.MessageBox.OK,
						icon : Ext.MessageBox.ERROR,
						width : 400
					});
				} //failure
			});
		}else{
		}
	},
	
	EditarRolRecordSelect: function(){
		
		miembroSeleccionado = this.grid.getSelectionModel().getSelection()[0].data;
		rolSeleccionado = this.gridRoles.getSelectionModel().getSelection()[0].data;
		console.log('rolSeleccionado');
		console.log(rolSeleccionado.idRol);
		this.storeEditFases = Ext.create('Ext.data.Store', {
		    storeId: 'rolesFaseStore',
			model: 'modelFases2',
		    proxy: {
			    type: 'ajax',
				url: '/fases/traerFases',
			    reader: {
				    type: 'json',
					root: 'fases'
			    }
		    },
			idProyecto: this.myIdProyecto,
			//codItem:itemSeleccionado.codItem,
			autoLoad: {start: 0, limit: 25, params:{idRol: rolSeleccionado.idRol, id: miembroSeleccionado.id, idProyecto: this.myIdProyecto}} 
			 
	    });
		
		//ComboBox para mostrar todas las fases disponibles del proyecto
		this.cmbEditFases = Ext.create('Ext.ux.form.field.BoxSelect', {

			fieldLabel: 'Fases Disponibles',
			name : 'cmb_fase_edit',
			id: 'id_cmbx_fase_edit',
			displayField: 'nombreFase',
			width: 494,
			//height: 50,
			//labelWidth: 130,
			store: this.storeEditFases,
			queryMode: 'local',
			emptyText: 'Seleccione la Fase al cual tendra el Rol',
			valueField: 'idFase',
			multiSelect :true,
			allowBlank : false
			
		});
		
		
		
		//Creamos el FormPanel que contendra los datos a editar
		this.FormEditRolesModal = Ext.create('Ext.form.Panel',{
			frame :true,
			title : 'Rol: "'+ rolSeleccionado.nombreRol + '" Asignado en las Fases',
			bodyStyle :'padding:5px 5px 0',
			width : 540,
			//height : 250,
			autoHeight : true,
			defaultType: 'textfield',
			items: [
				{
					xtype : 'fieldcontainer',
					labelStyle : 'font-weight:bold;padding:0',
					anchor : '90%',
					items: [
						this.cmbEditFases,
					]
				}
			],
			buttons: [{
					text : 'Guardar',
					id : 'id_btn_editar_guardar_fase',
					iconCls : 'icon_button_save',
					scope : this,
					handler : this.HandlerActualizarRoles
				},{
					text : 'Cancelar',
					id : 'id_btn_editar_cancelar_fase',
					iconCls : 'icon_button_cancel',
					scope : this,
					handler : function(){
						this.WindowFormEditRolesModal.close();
					}
				}
			]
		});
		
		//Una vez creado el FormPanel lo reseteamos
		this.FormEditRolesModal.getForm().reset();
		
		
	
	
		//traemos las fases que tiene el rol que estamos editando
		Ext.Ajax.request(
		{
			url:'/fases/editarFasesDeRol',
			//form:"[STICK FORM ID HERE]",
			method:'GET',
			scope : this,
			params: { idRol: rolSeleccionado.idRol, id: miembroSeleccionado.id, idProyecto: this.myIdProyecto},
			success: function(response, opts) {
				//alert("successfull");
				obj = Ext.decode(response.responseText)
				Ext.getCmp('id_cmbx_fase_edit').setValue(obj.fases)	
				
			},
			failure:function(res,opt) {
				alert("request failed");
			}
		});
		
		//Creamos la ventana que contendra el FormaPanel creado anteriormente
		this.WindowFormEditRolesModal = Ext.create('Ext.window.Window',{
			title : 'Administrar Roles',
			bodyStyle : 'padding:10px 10px 10px 10px',
			region : 'center',
			autoWidth: true,
			//width : 700,
			//height : 155,
			autoHeight : true,
			modal : true,
			//resizable : false,
			draggable : false,
			closable : true,
			closeAction : 'destroy',
			items : [this.FormEditRolesModal]
		});
		//Mostramos la ventana con el formulario de edicion y los datos del registro seleccionado
		this.WindowFormEditRolesModal.show();
		
	},
	
	//guardamos las fases despues de actualizar el rol demi miembro
	HandlerActualizarRoles: function(){
		
		this.myIdProyecto = idProyectoAux;
		miembroSeleccionado = this.grid.getSelectionModel().getSelection()[0].data;
		rolSeleccionado = this.gridRoles.getSelectionModel().getSelection()[0].data;
		
		if (this.FormEditRolesModal.getForm().isValid()){
			
			this.FormEditRolesModal.getForm().submit({
				method : 'POST',
				//type: "json",
				url : '/roles/guardarEditarFasesDeRol', 
				clientValidation : true,
				scope : this,
				params : {
					idProyecto: this.myIdProyecto,
					idMiembro: miembroSeleccionado.id,
					idRol: rolSeleccionado.idRol,
					idsFases : Ext.JSON.encode(Ext.getCmp('id_cmbx_fase_edit').getValue())
				},
				success: function(form, action){
					this.WindowFormEditRolesModal.close();
					this.storeRoles.load(
						{
							params:{id: miembroSeleccionado.id, idProyecto: this.myIdProyecto}
						}
					);
				},
				failure: function(form, action){
					Ext.Msg.alert("Error",action.result);
					Ext.MessageBox.show({
						title : 'Informacion del sistema',
						msg : action.result.msg,
						buttons : Ext.MessageBox.OK,
						icon : Ext.MessageBox.ERROR,
						width : 350
					});
				} //End failure
			});
			
		}
		
	},
	
	//Creamos la ventana para agregar un miembro al proyecto
	AgregarMiembroRecordSelect: function(){
		
		this.myIdProyecto = idProyectoAux;
		
		var dsCmbMiembros = Ext.create('Ext.data.Store', {
			model : 'modelUsuarios'
			//autoLoad : true
		});
		
		//ComboBox para mostrar usuarios disponibles
		var cmbMiembros = Ext.create('Ext.ux.form.field.BoxSelect', {

			fieldLabel: 'Usuarios Disponibles',
			name : 'cmb_miembro',
			id: 'id_cmbx_miembro',
			displayField: 'username',
			width: 494,
			//height: 50,
			//labelWidth: 130,
			store: dsCmbMiembros,
			queryMode: 'local',
			emptyText: 'Seleccione el Usuario para Miembro',
			valueField: 'id',
			multiSelect :true,
			allowBlank : false
			
		});
		
		//traemos los usuarios
		Ext.Ajax.request(
		{
			url:'/usuarios/verMiembros',
			//form:"[STICK FORM ID HERE]",
			method:'GET',
			scope : this,
			params: { 
				idProyecto: this.myIdProyecto
			},	  
			success: function(response, opts) {
				//alert("successfull");
				obj = Ext.decode(response.responseText)
				console.log(obj.miembros)
				Ext.getCmp('id_cmbx_miembro').setValue('admin')	
				dsCmbMiembros.loadData(obj.miembros)
				
			},
			failure:function(res,opt) {
				alert("request failed");
			}
		});
		
		//Creamos el FormPanel que contendra los datos a agregar
		this.FormAddMiembroModal = Ext.create('Ext.form.Panel',{
			frame :true,
			title : 'Datos del Miembro',
			bodyStyle :'padding:5px 5px 5px 5px',
			width : 540,
			//height : 100,
			autoHeight : true,
			defaultType: 'textfield',
			items: [
				{
					xtype : 'fieldcontainer',
					labelStyle : 'font-weight:bold;padding:0',
					anchor : '90%',
					items: [
						cmbMiembros,
					]
				}
			],
			buttons: [
				{
					text : 'Guardar',
					id : 'id_btn_guardar_miembro',
					iconCls : 'icon_button_save',
					scope : this,
					handler : this.HandlerGuardarMiembro
				},{
					text : 'Cancelar',
					id : 'id_btn_cancelar_cambiar_fase',
					iconCls : 'icon_button_cancel',
					scope : this,
					handler : function(){
						this.WindowFormAddMiembroModal.close();
					}
				}
			]
		});
		//Una vez creado el FormPanel lo reseteamos
		this.FormAddMiembroModal.getForm().reset();
		
		//Creamos la ventana que contendra el FormaPanel creado anteriormente
		this.WindowFormAddMiembroModal = Ext.create('Ext.window.Window',{
			title : 'Administrar Miembro',
			bodyStyle : 'padding:10px 10px 10px 10px',
			region : 'center',
			autoWidth: true,
			//width : 700,
			//height : 155,
			autoHeight : true,
			modal : true,
			//resizable : false,
			draggable : false,
			closable : true,
			closeAction : 'destroy',
			items : [this.FormAddMiembroModal]
		});
		//Mostramos la ventana con el formulario de edicion y los datos del registro seleccionado
		this.WindowFormAddMiembroModal.show();
		
	},
	HandlerGuardarMiembro :function(){
		this.myIdProyecto = idProyectoAux;
		
		if (this.FormAddMiembroModal.getForm().isValid()){
			
			this.FormAddMiembroModal.getForm().submit({
				method : 'POST',
				//type: "json",
				url : '/usuarios/guardarMiembro', 
				clientValidation : true,
				scope : this,
				params : {
					idProyecto: this.myIdProyecto,
					idsUsuarios : Ext.JSON.encode(Ext.getCmp('id_cmbx_miembro').getValue())
				},
				success: function(form, action){
					this.WindowFormAddMiembroModal.close();
					this.storeMiembro.load(
							{
								params:{idProyecto: this.myIdProyecto}
							}
					);
				},
				failure: function(form, action){
					Ext.Msg.alert("Error",action.result);
					Ext.MessageBox.show({
						title : 'Informacion del sistema',
						msg : action.result.msg,
						buttons : Ext.MessageBox.OK,
						icon : Ext.MessageBox.ERROR,
						width : 350
					});
				} //End failure
			});
			
		}
		
	},
	
	//método asociado al botón de eliminar 
	DeleteRecordSelect : function(){
		Ext.MessageBox.show({
			title : "Información del sistema",
			msg : "¿Realmente desea eliminar el registro seleccionado?",
			buttons : Ext.MessageBox.YESNO,
			icon : Ext.MessageBox.INFO,
			scope : this,
			fn : this.EliminarRegistroSeleccionado,
			width : 400
		});
	},
	
	//método que realiza la eliminación si es que se acepta el popUp
	EliminarRegistroSeleccionado : function(btn){
		if (btn == 'yes') { //btn=='yes'
			//this.WindowAdmAtributos.el.mask('Eliminando datos....Espere por favor...');
			registroSeleccionado = this.grid.getSelectionModel().getSelection()[0].data.id;
			Ext.Ajax.request({
				url : '/usuarios/eliminarMiembro', //application/controllers/Habitacion.php
				method : 'POST',
				scope : this,
				params : {
					idMiembro : registroSeleccionado,
					idProyecto: this.myIdProyecto
				},
				success: function(response, opts) { //success
					var obj = Ext.JSON.decode(response.responseText);
					if(obj.success==true){
						this.storeMiembro.load(
							{
								params:{idProyecto: this.myIdProyecto}
							}
					);
						Ext.Msg.alert('Estatus',  obj.msg);
						//this.WindowAdmAtributos.el.unmask();
					}
					else if(obj.success==false){
						//this.WindowAdmAtributos.el.unmask();
							Ext.MessageBox.show({
								title : "Informacion del sistema",
								msg : obj.msg,
								buttons : Ext.MessageBox.OK,
								icon : Ext.MessageBox.ERROR,
								width : 400
							});
					}
					else{
						//this.WindowAdmAtributos.el.unmask();
						Ext.MessageBox.show({
							title : "Informacion del sistema",
							msg : "Mensaje de error alternativo a la eliminacion del registro seleccionado",
							buttons : Ext.MessageBox.OK,
							icon : Ext.MessageBox.ERROR,
							width : 400
						});
					}
				}, //success
				failure: function(response, opts) { //failure
					//this.WindowAdmAtributos.el.unmask();
					var obj = Ext.JSON.decode(response.responseText);
					Ext.MessageBox.show({
						title : "Informacion del sitema",
						msg : "Error de conexion al servidor de la base de datos",
						buttons : Ext.MessageBox.OK,
						icon : Ext.MessageBox.ERROR,
						width : 400
					});
				} //failure
			});
		}else{
		}
	},
	
});

